<template>
    <div class="user-credit-report-user-info">
        <ul class="steps">
            <li class="steps__item active">
                <span>1</span>
                <p>芝麻信用</p>
            </li>
            <li class="steps__item active">
                <span>2</span>
                <p>个人信息</p>
            </li>
        </ul>
        <p class="tips">有借为您的信息提供安全加密，不会泄漏给第三方</p>

        <div class="big-title">个人基本信息</div>
        <div class="form-wrap">
            <ul class="form-box">
                <li class="form__item">
                    <span class="form__key">微信号</span>
                    <div class="form__value">
                        <input v-model='weixinNo' type="text" placeholder="请输入常用微信账号">
                    </div>
                </li>
                <li class="form__item select">
                    <span class="form__key">所在城市</span>
                    <div class="form__value">
                        <city
                            :select-city='cityInfo.name'
                            @set='setCity' >
                        </city>
                    </div>
                </li>
            </ul>
        </div>

        

        <span class="button long confirm" @click="submitUserInfo">确认无误，下一步</span>
        <contact></contact>



        <!-- <modal
            :show='show_warning'
            :maskClose='false'>
            <div class="modal-bind-card-warning">
                <p>感谢您选择有借，基于风控考虑，在有借进行借款／出借业务的用户，须年满22周岁。为您带来不便，请谅解。</p>
                <div class="modal-bind-card__button"><span @click='show_warning = false'>关闭</span></div>
            </div>
        </modal> -->
    </div>
</template>

<script>
    import { Promise } from 'es6-promise'
    import footerBar from '../components/FooterBar.vue'
    import selectGroup from '../components/SelectGroup.vue'
    import selectOption from '../components/SelectOption.vue'
    import radioGroup from '../components/RadioGroup.vue'
    import areaSelect from '../components/AreaSelect.vue'
    import radio from '../components/Radio.vue'
    import loading from '../components/Loading.vue'
    import checkBox from '../components/CheckBox.vue'
    import toolTip from '../components/ToolTip.vue'
    import modal from '../components/Modal.vue'
    import contact from '../components/Contact.vue'
    import confirm from '../components/Confirm.vue'
    import buttonLoading from '../components/ButtonLoading.vue'
    import pagination from '../components/Pagination.vue'
    import payPassword from '../components/PayPassword.vue'
    import pickerList from '../components/PickerList.vue'
    import tabBox from '../components/TabBox.vue'
    import tab from '../components/Tab.vue'
    import city from '../components/City.vue'
    import idNumber from '../filters/filter-idNumber'
    import relationList from '../data/relationList'
    import  { mapGetters, mapActions }  from 'vuex'
    import { userCreditReportUserInfoValidation } from '../validation/validation'
    import { reportApi, userApi } from '../api/api'
    import moment from 'moment'

    export default {
        components:{
            city,
            contact,
            footerBar,
            selectGroup,
            selectOption,
            radioGroup,
            radio,
            checkBox,
            areaSelect,
            loading,
            toolTip,
            modal,
            confirm,
            buttonLoading,
            pagination,
            payPassword,
            pickerList,
            tabBox,
            tab
        },
        filters:{
            idNumber
        },
        data() {
            return {
                creditReportNo:this.$route.params.no,
                placeholder:'--',
                newest:{},
                cityInfo : {
                    cityName:'杭州',
                    provName:'浙江'
                },
                relationList1:relationList,
                relationList2:relationList,
                name:'',
                idNumber:'',
                weixinNo:'',
                address:'',
                contact1Name:'',
                contact1Mobile:'',
                contact1Relation:'',
                contact2Name:'',
                contact2Mobile:'',
                contact2Relation:'',
                workingIdentityList:[
                  {
                    value: 1,
                    display: '上班族'
                  },
                  {
                    value: 2,
                    display: '个体户'
                  },
                  {
                    value: 3,
                    display: '无固定职业'
                  },
                  {
                    value: 4,
                    display: '企业主'
                  },
                  {
                    value: 5,
                    display: '学生'
                  }],
                workingIdentity: '',
                payoffModality: '',
                payoffModalityList: [
                  {
                    value: 1,
                    display: '银行卡发放'
                  },
                  {
                    value: 2,
                    display: '现金发放'
                  },
                  {
                    value: 3,
                    display: '银行卡+现金'
                }],
                bankPayoff: '',
                cashPayoff: '',
                workingYears: '',
                workingYearsList:[
                  {
                    value: 1,
                    display: '不足三个月'
                  },
                  {
                    value: 2,
                    display: '3-5个月'
                  },
                  {
                    value: 3,
                    display: '6-11个月'
                  },
                  {
                    value: 4,
                    display: '1-3年'
                  },
                  {
                    value: 5,
                    display: '4-7年'
                  },
                  {
                    value: 6,
                    display: '7年以上'
                }],
                grossMonthlyIncome: '',
                monthlyCashIncome: '',
                operatingYears: '',
                operatingYearsList: [
                  {
                    value: 1,
                    display: '不足三个月'
                  },
                  {
                    value: 2,
                    display: '3个月'
                  },
                  {
                    value: 3,
                    display: '半年'
                  },
                  {
                    value: 4,
                    display: '1年'
                  },
                  {
                    value: 5,
                    display: '2年'
                  },
                  {
                    value: 6,
                    display: '3年'
                  },
                  {
                    value: 7,
                    display: '5年以上'
                }],
                businessRegistration: '',
                businessRegistrationList: [
                  {
                    value: 1,
                    display: '未注册营业执照'
                  },
                  {
                    value: 2,
                    display: '本地'
                  },
                  {
                    value: 3,
                    display: '外地'
                }],
                whetherBusinessRegistration: '',
                whetherBusinessRegistrationList: [
                  {
                    value: 1,
                    display: '没办理过'
                  },
                  {
                    value: 2,
                    display: '已注册，注册不满6个月'
                  },
                  {
                    value: 3,
                    display: '已办理，注册6-11个月'
                  },
                  {
                    value: 4,
                    display: '已办理，注册满1年'
                  },
                  {
                    value: 5,
                    display: '已办理，注册满2年'
                  },
                  {
                    value: 6,
                    display: '已办理，注册满3年'
                  },
                  {
                    value: 7,
                    display: '已办理，注册满4年'
                  },
                  {
                    value: 8,
                    display: '已办理，注册满5年以上'
                }],
                cashIncome: '',
                whetherAccumulationFund: '',
                whetherAccumulationFundList: [
                  {
                    value: 1,
                    display: '否，不缴纳'
                  },
                  {
                    value: 2,
                    display: '是，有本地公积金'
                  }
                ],
                accumulationFund: '',
                whetherPayoffModality: '',
                whetherPayoffModalityList: [
                  {
                    value: 1,
                    display: '没有'
                  },
                  {
                    value: 2,
                    display: '有本地社保'
                  }
                ],
                whetherHouseProperty: '',
                whetherHousePropertyList: [
                  {
                    value: 1,
                    display: '无房产'
                  },
                  {
                    value: 2,
                    display: '有房产，有按揭'
                  },
                  {
                    value: 3,
                    display: '有房产，无按揭'
                  }
                ],
                realEstateValuation: '',
                houseMonthlyMortgageAmount: '',
                propertyAge: '',
                propertyAgeList: [
                  {
                    value: 1,
                    display: '10年以下'
                  },
                  {
                    value: 2,
                    display: '10-15年（含）'
                  },
                  {
                    value: 3,
                    display: '15-20年（含）'
                  },
                  {
                    value: 4,
                    display: '20-25年（含）'
                  },
                  {
                    value: 5,
                    display: '25-30年（含）'
                  },
                  {
                    value: 6,
                    display: '30年以上'
                  }
                ],
                whetherCar: '',
                whetherCarList: [
                  {
                    value: 1,
                    display: '无车'
                  },
                  {
                    value: 2,
                    display: '有车，有按揭'
                  },
                  {
                    value: 3,
                    display: '有车，无按揭'
                  }
                ],
                carMonthlyMortgageAmount: '',
                creditConditions: '',
                creditConditionsList: [
                  {
                    value: 1,
                    display: '1年内逾期超过3次或超过90天'
                  },
                  {
                    value: 2,
                    display: '1年内逾期少于3次且少于90天'
                  },
                  {
                    value: 3,
                    display: '信用良好，无逾期'
                  },
                  {
                    value: 4,
                    display: '无信用卡或贷款'
                  }
                ],
              }
        },
        computed:{
            ...mapGetters([
                'msgTip',
                'localInfo'
            ]),
            userInfo(){
                return this.localInfo.userInfo
            }
        },
        methods:{
            // actions
            ...mapActions([
                'showLoading',
                'hideLoading',
                'setUserInfo',
                'setMsgTip'
            ]),
            //
            orNumber(item, name) {
              if (item !== '' && !Number(item)) {
                this[name] = ''
                this.setMsgTip({
                    text:'请输入正确格式的数字',
                    type:'warn'
                })
              } else if (item !== ''){
                if (name === 'realEstateValuation') {
                  if (item.length > 10) {
                    this.setMsgTip({
                        text:'房产估值价不得超过10位数',
                        type:'warn'
                    })
                    this[name] = ''
                  } else if (item > 1000000000) {
                    this.setMsgTip({
                        text:'房产估值价不得大于1000000000',
                        type:'warn'
                    })
                    this[name] = ''
                  } else {
                    this[name] = Number(item)
                  }
                } else {
                  if (item.length > 8 ) {
                    this.setMsgTip({
                        text:'输入字数不得超过8位数',
                        type:'warn'
                    })
                    this[name] = ''
                  } else {
                    this[name] = Number(item)
                  }
                }
              }
            },
            // function
            submitUserInfo(){
                let params = {
                    creditReportNo:this.creditReportNo,
                    province:this.cityInfo.provName,
                    city:this.cityInfo.cityName,
                    weixinNo:this.weixinNo
                }
                if(!userCreditReportUserInfoValidation(params)) return

                this.showLoading()
                reportApi.submitUserInfo(params)
                .then(result=>{
                    this.setMsgTip({
                        text:'个人信息提交成功',
                        type:'success'
                    })
                })
                .then(this.setUserInfo)
                .then(result=>{
                    this.hideLoading()
                   /* this.$router.push({
                        name:'loan-in-index',
                    })*/
                    this.$router.push({
                        name:'user-credit-report-index',
                    })
                    return
                })
                .catch(error => {
                    console.error(error)
                    this.hideLoading()
                })
            },
            goUserBindCardTransactionPassword(){
                this.$router.push({
                    name:'user-bind-card-transaction-password',
                    params:{
                        no:this.creditReportNo
                    }
                })
            },
            goRouter(name){
                this.$router.push({
                    name:name
                })
            },
            goSuccess(){
                this.$router.push({
                    name:'loan-in-success'
                })
            },
            withDrawAll(){
                this.withDrawMoney = 600
            },
            test(){
                console.log(1)
            },
            goPay(){
                this.payStatus = true
                console.log(1)
            },
            goDetail(item){
                this.$router.push({
                    name:'user-detail',
                    params:{
                        id:item.userId,
                    }
                })
            },
            setCity(cityInfo){
                this.cityInfo = cityInfo
            },
            getList(num){
                this.loading = true
                allApi.userList(num)
                .then(result=>{
                    this.loading = false
                    this.listInfo = result
                    this.records = result.records
                    if(result.totalPage < result.pageNum){
                        this.getList(result.totalPage)
                    }
                })
                .catch(error => {
                    console.error(error)
                    this.loading = false
                })
            },
            getAccount(){
                this.loading_count = true
                allApi.userCount()
                .then(result=>{
                    this.loading_count = false
                    this.userCount = result
                })
                .catch(error => {
                    console.error(error)
                    this.loading_count = false
                })
            },
            getNewest(){
                this.showLoading()
                reportApi.newest()
                .then(result=>{
                    this.newest = result
                    this.hideLoading()
                })
                .catch(error => {
                    console.error(error)
                    this.hideLoading()
                })
            },
        },
        created(){
            if(this.userInfo.user.realName){
              
            this.name = this.userInfo.user.realName
            }
            this.idNumber = this.userInfo.user.idNumber

            this.getNewest()
        }
    }
</script>

<style lang="scss">
    @import "../sass/variables";
    @import "../sass/extends";
    @import "../sass/mixins";
    .user-credit-report-user-info{
        .tips{
            @extend %font-caption;
            padding: 8px 24px;
        }
        .form-box{
            margin-top: 0;
            margin-bottom: 16px;
            &:last-child{
                margin-bottom: 8px;
            }
        }
    }

</style>